import React, { useState } from 'react';
import { Button, Modal, Form, Input, Radio } from 'antd';

const EditPwd = ({ visible, onCreate, onCancel }) => {
  const [form] = Form.useForm();

  const [rules] = useState({
    oldpwd: [{ required: true, message: '请输入你的原密码!' }],
    password: [{ required: true, message: '请输入新密码!' }],
  }, [])

  return (
    <Modal
      visible={visible}
      title="修改密码"
      okText="确认"
      cancelText="取消"
      onCancel={onCancel}
      onOk={() => {
        form.validateFields().then((values) => {
          form.resetFields();
          onCreate(values);
        }).catch((info) => {
          console.log('Validate Failed:', info);
        });
      }}
    >
      <Form form={form} layout="vertical" name="form_in_modal" initialValues={{ modifier: 'public' }}>
        <Form.Item name="oldpwd" label="原密码" rules={rules.oldpwd} >
          <Input.Password placeholder="请输入原密码" />
        </Form.Item>
        <Form.Item name="password" label="新密码" rules={rules.password}>
          <Input.Password placeholder="请输入新密码" />
        </Form.Item>
      </Form>
    </Modal>
  );
};

export default EditPwd;